<template>
  <div data-v-4c6cfcd0="" class="user">
    <div data-v-4c6cfcd0="" class="mescroll" style="top: 0px; bottom: 88px">
      <div data-v-4c6cfcd0="">
        <div data-v-4c6cfcd0="" class="user-top">
          <div data-v-4c6cfcd0="" class="user-info-box">
            <div data-v-4c6cfcd0="" class="user-info-msg">
              <div data-v-4c6cfcd0="" class="logo">
                <img
                  data-v-4c6cfcd0=""
                  :src="imgSrc"
                />
              </div>
              <div
                data-v-4c6cfcd0=""
                class="pull-left user-name one-txt-cut"
              >{{this.$store.state.zlstore.userinfo.name}}</div>
            </div>
            <div data-v-4c6cfcd0="" class="div_user_setting">
              <router-link to="/children/settinglist">
                <img
                  data-v-4c6cfcd0=""
                  src="../assets/img/setting.png"
                  style="margin-right: 8px"
                />
              </router-link>
            </div>
          </div>
          <div data-v-4c6cfcd0="" class="user-action">
            <div data-v-4c6cfcd0="" class="action-top">
              <ul data-v-4c6cfcd0="" class="action-top-ul">
                <li data-v-4c6cfcd0="">
                  <div data-v-4c6cfcd0="" class="action-li-number">0</div>
                  <div data-v-4c6cfcd0="" class="action-li-text">我的收藏</div>
                </li>
                <li data-v-4c6cfcd0="">
                  <div data-v-4c6cfcd0="" class="action-li-number">0</div>
                  <div data-v-4c6cfcd0="" class="action-li-text">优惠券</div>
                </li>
                <li data-v-4c6cfcd0="">
                  <div data-v-4c6cfcd0="" class="action-li-number">
                    <span data-v-4c6cfcd0="" class="action-li-number-icon"
                      >￥</span
                    >0.00
                  </div>
                  <div data-v-4c6cfcd0="" class="action-li-text">我的帐户</div>
                </li>
                <li data-v-4c6cfcd0="">
                  <div data-v-4c6cfcd0="" class="action-li-number">0</div>
                  <div data-v-4c6cfcd0="" class="action-li-text">浏览记录</div>
                </li>
              </ul>
            </div>
            <div data-v-4c6cfcd0="" class="order">
              <p data-v-4c6cfcd0="" class="order-title">
                <span data-v-4c6cfcd0="" class="pull-left font-px32 color-333"
                  >我的订单</span
                >
                <router-link to="/children/orderpage/0">
                  <span
                    data-v-4c6cfcd0=""
                    class="pull-right font-px24 color-999 m-pull-right-style"
                    >查看全部
                    <img
                      data-v-4c6cfcd0=""
                      src="https://images.yaodouwang.com/img/user/order-arrow.png"
                      alt=""
                      class="order-arrow"
                  /></span>
                </router-link>
              </p>
              <div data-v-4c6cfcd0="" class="order-icon">
                <router-link to="/children/orderpage/1">
                  <span data-v-4c6cfcd0=""
                    ><img
                      data-v-4c6cfcd0=""
                      src=""
                      alt=""
                    />
                    <p data-v-4c6cfcd0="" class="font-px24 color-333">待支付</p>
                    <!----></span
                  >
                </router-link>
                <router-link to="/children/orderpage/2">
                  <span data-v-4c6cfcd0=""
                    ><img
                      data-v-4c6cfcd0=""
                      src=""
                      alt=""
                    />
                    <p data-v-4c6cfcd0="" class="font-px24 color-333">待收货</p>
                    <!----></span
                  >
                </router-link>
                <router-link to="/children/orderpage/3">
                  <span data-v-4c6cfcd0=""
                    ><img
                      data-v-4c6cfcd0=""
                      src=""
                      alt=""
                    />
                    <p data-v-4c6cfcd0="" class="font-px24 color-333">已完成</p>
                    <!----></span
                  >
                </router-link>
                <router-link to="/children/orderpage/4">
                  <span data-v-4c6cfcd0=""
                    ><img
                      data-v-4c6cfcd0=""
                      src=""
                      alt=""
                    />
                    <p data-v-4c6cfcd0="" class="font-px24 color-333">售后</p>
                    <!----></span
                  >
                </router-link>
                <router-link to="/children/orderpage/5">
                  <span data-v-4c6cfcd0=""
                    ><img
                      data-v-4c6cfcd0=""
                      src=""
                      alt=""
                    />
                    <p data-v-4c6cfcd0="" class="font-px24 color-333">
                      已取消
                    </p></span
                  >
                </router-link>
              </div>
            </div>
            <div data-v-4c6cfcd0="" class="tool">
              <p data-v-4c6cfcd0="" class="tool-title">
                <span data-v-4c6cfcd0="" class="pull-left font-px32 color-333"
                  >常用工具</span
                >
              </p>
              <div data-v-4c6cfcd0="" class="tool-icon">
                <span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">药神卡</p>
                  <!----></span
                ><span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">处方药</p>
                  <!----></span
                ><span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">领券中心</p>
                  <!----></span
                ><span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">收货地址</p>
                  <!----></span
                ><span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">我的问答</p>
                  <!----></span
                >
                <span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">
                    联系客服
                  </p></span
                >
                <span data-v-4c6cfcd0=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">
                    商家入驻
                  </p></span
                >
                <span data-v-4c6cfcd0=""
                  ><a data-v-4c6cfcd0="" class="font-px24 color-333"
                    ><img
                      data-v-4c6cfcd0=""
                      src=""
                      alt=""
                    />
                    <p data-v-4c6cfcd0="" class="serve">药师在线</p></a
                  ></span
                >
                <span data-v-4c6cfcd0="" class=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">
                    我的问诊
                  </p></span
                >
                <span data-v-4c6cfcd0="" class=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">
                    用户反馈
                  </p></span
                >
                <span data-v-4c6cfcd0="" class=""
                  ><img
                    data-v-4c6cfcd0=""
                    src=""
                    alt=""
                  />
                  <p data-v-4c6cfcd0="" class="font-px24 color-333">
                    我的分销
                  </p></span
                >
              </div>
            </div>
            <div data-v-4c6cfcd0="" class="user-action-style">
              <img
                data-v-4c6cfcd0=""
                src="https://images.yaodouwang.com/img/user/top_action1.png"
                alt=""
              />
            </div>
          </div>
        </div>
        <div
          data-v-62ec0f22=""
          data-v-4c6cfcd0=""
          id="commodity"
          class="commodity"
        >
          <div data-v-62ec0f22="" class="jg"></div>
          <div data-v-62ec0f22="" class="title">
            <div data-v-62ec0f22="" class="title-left">
              <span data-v-62ec0f22="" class="line-left"></span>
              <span data-v-62ec0f22="" class="otherProduct-img-box"
                ><img
                  data-v-62ec0f22=""
                  src=""
              /></span>
            </div>
            <div data-v-62ec0f22="" class="title-text"></div>
            <div data-v-62ec0f22="" class="title-right">
              <span data-v-62ec0f22="" class="line-left"></span>
            </div>
          </div>
          <van-list
            v-model="loading"
            :finished="finished"
            @load="onLoad"
          >
            <div data-v-62ec0f22="" class="commodity_list">
              <div
                data-v-c63fad28=""
                data-v-62ec0f22=""
                class="product-list_item"
                v-for="item in goodsList"
                :key="item.productId"
                @click="linkToDetail(item.productId)"
              >
                <div data-v-c63fad28="" class="product-img">
                  <img
                    data-v-c63fad28=""
                    alt="商品图片"
                    :src="item.imageUrl"
                    lazy="loaded"
                  />
                </div>
                <div data-v-c63fad28="" class="product-info">
                  <div
                    data-v-c63fad28=""
                    class="product-name txt-cut color-333 font-px26"
                  >
                    <span data-v-c63fad28="">{{ item.internalName }}</span>
                  </div>
                  <div data-v-c63fad28="" class="product-store">
                    <span
                      data-v-c63fad28=""
                      class="font-px24 color-999 vertical-middle one-txt-cut"
                      >{{ item.merchantInfo.merchantName }}</span
                    >
                    <img
                      data-v-c63fad28=""
                      src=""
                      alt=""
                      class="vertical-middle"
                    />
                  </div>
                  <div data-v-c63fad28="" class="product-tag">
                    <div
                      data-v-c63fad28=""
                      class="yskMake"
                      v-if="item.labels.useHealthyCard == 'Y'"
                    >
                      药神卡
                    </div>
                    <!---->
                    <div
                      data-v-c63fad28=""
                      class="quan"
                      v-if="item.labels.quan == 'Y'"
                    >
                      <img
                        data-v-c63fad28=""
                        src="https://images.yaodouwang.com/img/home/tag_coupon.png"
                        alt="券"
                      />
                    </div>
                    <div
                      data-v-c63fad28=""
                      alt="券"
                      class="pt-icon"
                      v-if="item.labels.isGroup == 'Y'"
                    >
                      拼团
                    </div>
                    <!---->
                  </div>
                  <div data-v-c63fad28="" class="product-price">
                    <div data-v-c63fad28="" class="product-price-left">
                      <div
                        data-v-d4462b7e=""
                        data-v-c63fad28=""
                        class="money_show"
                        fontcolor="#FF7900"
                      >
                        <span data-v-d4462b7e="" class="now_money"
                          ><span data-v-d4462b7e=""
                            ><span data-v-d4462b7e="" class="font-px28">¥</span
                            ><span data-v-d4462b7e="" class="font-px38"
                              >{{ item.price
                              }}<span data-v-d4462b7e="" class="font-px26"
                                >.00</span
                              ></span
                            ></span
                          ></span
                        >
                      </div>
                    </div>
                    <div
                      data-v-cdd5d3c4=""
                      data-v-c63fad28=""
                      class="cart-icon"
                    >
                      <img
                        data-v-cdd5d3c4=""
                        src=""
                        alt="加购物车"
                        v-if="item.labels.isGroup != 'Y'"
                      />
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </van-list>
        </div>
      </div>
      <div
        class="mescroll-upwarp mescroll-hardware"
        style="visibility: visible; display: block"
      >
        <p id="downTip" style="color: #999999; font-size: 26px" v-if="finished">
          —— 已经到底了 ——
        </p>
      </div>
    </div>
    <a
      data-v-4c6cfcd0=""
      href="tel:400-1760-518"
      id="call"
      style="opacity: 0; width: 0px; height: 0px"
    ></a>
  </div>
</template>

<script>
import { minegoods } from "../api/zl-goods.js";
export default {
  data() {
    return {
      goodsList: [],
      loading: false,
      finished: false,
      pageIndex: 1,
      imgSrc: 'https://images.yaodouwang.com/img/common/login.jpg'
    };
  },
  methods: {
    onLoad() {
      // 异步更新数据
      // setTimeout 仅做示例，真实场景中一般为 ajax 请求
      minegoods(this.pageIndex).then((res) => {
        let { products } = res.data.data;
        if (products.length) {
          this.loading = false;
          this.goodsList = [...this.goodsList, ...products];
          this.pageIndex++;
        } else {
          this.finished = true;
        }
      });
    },
    linkToDetail(id) {
      this.$router.push("/children/detail/" + id);
    },
  },
  created () {
    if(this.$store.state.zlstore.userinfo.avatar){
      this.imgSrc='http://39.105.10.58:3000'+this.$store.state.zlstore.userinfo.avatar;
    }
  },
};
</script>


<style lang="less">
.product-img {
  width: 350px !important;
  height: 350px !important;
}
.van-list__error-text,
.van-list__finished-text,
.van-list__loading {
  font-size: 30px !important;
}
</style>
